revision:
The <span> tag is an inline container used to mark up a part of a text, or a part of a document. The tag is easily styled by CSS or manipulated with JavaScript using the "class" or "id" attribute.
The <span> tag is much like the <div> element, but <div> is a "block-level" element and <span> is an "inline" element.
It is a generic inline container for phrasing content, which does not inherently represent anything.
It can be used to group elements for styling purposes (using the "class" or "id" attributes), or because they share attribute values, such as "lang". It should be used only when no other semantic element is appropriate.
<span> . . . </span>
My mother has blue eyes and my father has dark green eyes.
<p class="spec-1">My mother has <span style="color:blue;font-weight:bold">blue</span>
eyes and my father has <span style="color:darkolivegreen;font-weight:bold">
dark green</span> eyes.</p>
Add the basil, pine nuts and garlic to a blender and blend into a paste.
Gradually add the olive oil while running the blender slowly.
<style>
span.ingredient {color: #f00;}
</style>
<p class="spec-1">Add the <span class="ingredient">basil</span>, <span
class="ingredient">pine nuts</span> and <span class="ingredient">garlic</span>
to a blender and blend into a paste.</p>
<p class="spec-1">Gradually add the <span class="ingredient">olive oil</ span>
while running the blender
slowly.</p>